<template>
    <div class="manage">
        <header>
            <van-nav-bar
            :title=title
            right-text="切换"
            @click-right="onClickRight"
            />
            <van-search v-model="search" :placeholder=placeholder />
        </header>
        <router-view></router-view>
    </div>
</template>

<script>
import { toRefs,reactive } from 'vue';
import { useRouter } from 'vue-router';
import articleVue from '../components/article.vue'
export default {
   setup(){
        const state = reactive({
            title:'文章管理',
            search:'',
            placeholder:'请输入文章标题或id'
        })

        const $router = useRouter()

        //切换文章/用户管理按钮
        function onClickRight(){
            const url = (location.hash).slice(1)
            if(url === '/manage/article'){
                $router.replace({path: 'user'})
            }else{
                $router.replace({path: 'article'})
            }
        }

        return{
            ...toRefs(state),
            onClickRight
        }
   },
   components:{
    articleVue
   }

}
</script>

<style lang="less" scoped>

</style>